
<template>
    <div>
        <van-nav-bar title="修改个人信息" left-arrow @click-left="onClickLeft" >
            <template #right>
                <span @click="setWood">保存</span>
            </template>
        </van-nav-bar>
        <van-cell-group v-if="tag=='nickname'"  class="nickname">
            <van-field v-model="value" placeholder="请输入昵称"></van-field>
        </van-cell-group>
        <ul v-else-if="tag == 'sex'" class="content">
            <li :class="{active:value==0}" @click="onSex(0)">男</li>
            <li :class="{active:value==1}" @click="onSex(1)">女</li>
        </ul>
        <!-- 学科  复选框 -->
    </div>
</template>

<script>
    import {  user } from "@/request/http";
    import { NavBar,CellGroup,Field,Toast, Switch } from "vant";
    export default {
        name:"setinfo",
        components:{
            [NavBar.name]:NavBar,
            [CellGroup.name]:CellGroup,
            [Field.name]:Field,
            [Toast.name]:Toast,

        },
        data(){
            return{
                value:this.$route.query.value,
                tag:this.$route.query.tag,

            }
        },
        methods:{
            onSex(v){
                this.value = v;
            },
            setWood(){
                console.log(this.value)
                switch (this.tag) {
                    case "nickname":
                        if (!this.value) {
                            this.$toast("昵称不能为空")
                        }
                        user({nickname:this.value}).then(res=>{
                            console.log(res)
                            this.$toast("昵称修改成功")
                            this.$router.go(-1)
                        })
                        break;
                    case "sex":
                        if (this.value) {
                            this.value =1
                        }else{
                            this.value =0
                        }
                        user({sex:this.value}).then(res=>{
                            console.log(res)
                            this.$toast("性别修改成功")
                            this.$router.go(-1)
                        })
                        break;                 
                }

            },
            onClickLeft(){
                this.$router.go(-1)
            }
        },
        mounted(){
            console.log(this.$route.query)
        }

    }
</script>

<style lang="scss" scoped>
.nickname{
    width: 100%;
    height: 45px;
    background: #fff;
    margin-top: 15px;
}

.content{
    margin-top: 15px;
    width: 100%;
    background: #fff;
    li{
        padding-left: 10px;
        padding-right: 30px;
        height: 50px;
        line-height: 50px;
        font-size: 15px;
        color: #595959;
        position: relative;  
    }
    .active{
        background: url("~@/assets/theme-img/icon-check.png") no-repeat right center;
        background-size: 15px 15px;
        margin-right: 20px;
    }

}

</style>